<!DOCTYPE html>
<html lang="en">

<head>
    <title>活动详情</title>
    <#include "/lx/activity/components/meta.html" />
    <#include "/lx/activity/components/stylesheets.html" />
    <link rel="stylesheet" href="/lx/activity/stylesheets/info.css?v=3">
</head>

<body>
    <div id="app">
        <img :src="info.cover" class="top-image"></img>
        <div class='header'>
            <div class='title fl'>{{ info.title }}</div>
            <div class='school fr'>
                <span v-if="info.type == 1">线下活动</span>
                <span v-if="info.type == 2">线上活动</span>
                | {{ info.schoolName }}
            </div>
            <div class='clear'></div>
        </div>
        <div class='info'>
            <div class='time'>
                <img src="/lx/activity/assets/img/location.png?v=2"></img>
                <div>{{ info.time }}</div>
            </div>
            <div class='location' v-if="info.location">
                <img src="/lx/activity/assets/img/time.png"></img>
                <div>{{ info.location }}</div>
            </div>
            <button class='am-btn am-btn-default button' style="color: #000;" v-if="info.isOver == 1 && info.type == 1" disabled="disabled">活动结束</button>
            <button class='am-btn am-btn-default button' style="color: #000;" v-else-if="info.isOver == 1 && info.type == 2" @click="enter">活动结束，查看回放</button>
            <button class='am-btn am-btn-default button theme-background-color1' style="color: #fff;" v-else-if="info.status != 1" @click="enroll">我要报名</button>
            <button class='am-btn am-btn-default button theme-background-color1' style="color: #fff;" v-else-if="info.type == 1" disabled="disabled">已报名</button>
            <button class='am-btn am-btn-default button theme-background-color1' style="color: #fff;" v-else-if="info.type == 2" @click="enter">进入活动</button>
            <div class="feedback theme-color1" @click="feedback" v-if="info.isOver == 1">活动反馈</div>
        </div>
        <div class='content'>
            <article v-html="info.content"></article>
        </div>
    </div>
    <#include "/lx/activity/components/scripts.html" />
    <#include "/lx/activity/components/wxConfig.html" />
    <script type="text/javascript">
    var app = new Vue({
        el: '#app',
        data() {
            return {
                info: ''
            }
        },
        mounted: function() {
            this.info = ${info!''}
            var self = this;
            wx.ready(function() {
                var protocol = document.location.protocol 
                var href = document.location.href 
                var title = self.info.title;
                var desc = self.info.content;
                desc = '超级留学顾问'
                var link = '${host}/mini/activity/detail?id=' + self.info.id;
                // var imgUrl = "${img!''}"
                // var imgUrl = self.info.cover
                var imgUrl = 'http://res.superlinkplus.com/logo/superlink.jpeg'
                initWXShareAll('超级留学顾问', title, href, imgUrl)
            })
        },
        methods: {
            enter() {
                var url = "/lx/mini/activity/attend"
                var param = {
                    activityId: this.info.id
                };
                var success = (response) => {
                    window.location.href = this.info.url;
                }
                var fail = (response) => {
                    msg(response.msg);
                }
                var complete = () => {}
                request(url, param, success, fail, complete);
            },
            enroll() {
                window.location.href = "/lx/mini/activity/enroll?activityId=" + this.info.id;
            },
            feedback() {
                window.location.href = "/lx/mini/activity/feedback?activityId=" + this.info.id;
            }
        }
    })
    </script>
    <script type="text/javascript">
    wx.ready(function() {
        // initWXShare()
    });
    </script>
</body>

</html>